<template>
<div class="mainDiv" style="padding:20px;box-sizing: border-box;flex-direction: column;">
	<div class="rowHead">
				<el-input
					class="searchArea"
					placeholder="搜索品牌名称或描述"
					v-model="page.search"
					@keyup.enter.native="searchList">
					<i slot="suffix" class="el-icon-search" style="line-height: 40px;width: 25px;cursor: pointer;" @click="searchList"></i>
				</el-input>
			</div>

			<el-table :data="list" :stripe="true" @row-click="danji" @row-dblclick="dblclick" height="100%">
				<el-table-column prop="id" label="ID" width="100"></el-table-column>
				<el-table-column prop="name" label="品牌名称"></el-table-column>
				<el-table-column prop="remarks" label="品牌描述" :show-overflow-tooltip="true"></el-table-column>
				<el-table-column prop="isdisabled" label="状态">
					<template slot-scope="scope">
						<el-tag type="success" size="mini" v-if="!scope.row.isdisabled">正常</el-tag>
						<el-tag type="danger" size="mini" v-else>停用</el-tag>
					</template>
				</el-table-column>
				<el-table-column prop="fname" label="所属厂商"></el-table-column>
				<el-table-column prop="addtime" label="添加日期">
					<template slot-scope="scope">
						{{scope.row.addtime|dateTime}}
					</template>
				</el-table-column>
				<el-table-column label="选择">
					<template slot-scope="scope">
						<el-switch
							v-model="scope.row.selected"
							on-text="是"
							off-text="否">
						</el-switch>
					</template>
				</el-table-column>
			</el-table>
			<div class="block center bg-light">
				<el-pagination
					@current-change="currentChange"
					:current-page="page.pages"
					:page-size="page.limits"
					layout="total, prev, pager, next"
					:total="total">
				</el-pagination>
			</div>
			<div style="text-align:right">
				<el-button icon="upload2" type="success" size="mini" @click="submit">确定选择</el-button>
				<el-button icon="close" type="danger" size="mini" @click="close">取消关闭</el-button>
			</div>
</div>	
</template>
<script>
import C from '@/common/common.js'

export default {
  name: 'openBrandList',
  data () {
    return {
      list: [],
      total: 0,
      page: {
        pages: 1,
        limits: 15,
        search: '',
        zt: 0
      }
    }
  },
  methods: {
    danji: function (row, event) {
      event.preventDefault()
      this.list.forEach((col) => {
        col.selected = false
      })
      row.selected = true
      this.select = row
    },
    dblclick: function (row, event) {
      event.preventDefault()
      C.closeBrowserWindow(row)
    },
    submit: function () {
      if (!this.select.id) {
        C.error('请选择分类')
        return false
      }
      C.closeBrowserWindow(this.select)
    },
    close: function () {
      C.closewin()
    },
    currentChange: function (val) {
      this.page.pages = val
      this.getList()
    },
    searchList: function () {
      this.getList()
    },
    getList: async function (nums, limits, searchStr) {
      let that = this
      let data = await C.ajax('/shop/brand/getAllBrandList', this.page)
      if (data) {
        that.total = data.count
        data.data.forEach((row) => {
          row.selected = false
        })
        that.list = data.data
      }
    }
  },
  mounted: function () {
    this.getList()
  }
}
</script>